<template>

  <div>
<el-table
    :data="tableData.filter(data => !search || data.new_title.toLowerCase().includes(search.toLowerCase()))"
    style="width: 100%"
    v-loading="loading"
    >
    <el-table-column
      label="日期"
      prop="new_time">
    </el-table-column>
    <el-table-column
      label="标题"
      prop="new_title">
    </el-table-column>
    <el-table-column
      align="right">
      <template slot="header" slot-scope="scope">
        <el-input
          v-model="search"
          size="mini"
          placeholder="输入关键字搜索"/>
      </template>
      <template slot-scope="scope">
        <el-button
          size="mini"
          @click="handleEdit(scope.$index, scope.row)">Edit</el-button>
        <el-button
          size="mini"
          type="danger"
          @click="handleDelete(scope.$index, scope.row)">Delete</el-button>
      </template>
    </el-table-column>
  </el-table>
   <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="currentPage1"
        :page-size="pagesize"
        layout="total, prev, pager, next"
        :total='total'>
      </el-pagination>
  </div>


</template>

<script>

  export default {
     data() {
          return {
            total:null,
            currentPage1:1,
            pagesize:10,
            tableData: [{
              date: '2016-05-02',
              name: '王小虎',
              address: '上海市普陀区金沙江路 1518 弄',
              id:1,
            }, {
              date: '2016-05-04',
              name: '王小虎',
              address: '上海市普陀区金沙江路 1517 弄',
              id:2,
            }, {
              date: '2016-05-01',
              name: '王小虎',
              address: '上海市普陀区金沙江路 1519 弄',
              id:3,
            }, {
              date: '2016-05-03',
              name: '王小虎',
              address: '上海市普陀区金沙江路 1516 弄',
              id:4,
            }],
            loading: true,
            search: ''
          }
        },
       created(){
           // console.log(this);
           // console.log(this._data);
           this.getnewslist(this.currentPage1,this.pagesize);

        },
        methods: {
          getnewslist(currentPage1,pagesize){
            this.$axios.post(process.env.API_HOST+"/houtai/index/newslist",{page:currentPage1,pagesize:pagesize}).then(res=>{
              if(res.status===200){
                 //console.log("ss");
               // console.log(res.data);
                this.total=res.data.max;
                this.tableData=res.data.context;
                this.loading=false;

              }
            }, res => {
    // 错误回调
                       console.log(res);



                 }
            );


          },
          handleEdit(index, row) {
            //利用row得到id
            console.log(index, row);
            this.$router.push({path:'/new/newup',query:{newmsg:row}});


          },
          handleDelete(index, row) {
            console.log(index, row);
            console.log(index, row.new_id);
             console.log(index, row.new_imge);
             this.$axios.post(process.env.API_HOST+"/houtai/index/newdel",{id:row.new_id,src:row.new_imge}).then(res=>{
                       if(res.status===200){
                          //console.log("ss");
                        // console.log(res.data);
                        this.open3(res.data.msg);
                         this.getnewslist(this.currentPage1,this.pagesize);

                       }
                     }, res => {
             // 错误回调
                                console.log(res);



                          }
                     );




          } ,
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
        this.getnewslist(val,this.pagesize);
      },
      open3(msg) {
             this.$message({
               message: msg,
               type: 'warning'
             });
           },

    }

    }

</script>

<style>
</style>
